<template>
  <section>
    <router-view />
    <div style="height: 1.3333rem"></div>
    <van-tabbar route>
      <van-tabbar-item
        replace
        :to="item.path"
        v-for="(item, index) of tabbarList"
        :key="index"
      >
        <span>{{ item.text }}</span>
        <template #icon="props">
          <img :src="props.active ? item.icond : item.icon" />
        </template>
      </van-tabbar-item>
    </van-tabbar>
  </section>
</template>
<script>
export default {
  data() {
    return {
      tabbarList: [
        {
          icon: require("@/assets/images/iconpng/icon/home_1.png"),
          icond: require("@/assets/images/iconpng/icon/home_2.png"),
          isActive: true,
          text: "首页",
          path: "/selfService",
        },

        {
          icon: require("@/assets/images/iconpng/icon/mine_1.png"),
          icond: require("@/assets/images/iconpng/icon/mine_2.png"),
          isActive: false,
          text: "我的",
          path: "/mine",
        },
      ],
    };
  },
};
</script>
<style lang="scss" scoped></style>
